.clear
  :clear both

body, table, form, input, textarea, select
  :font-family arial, helvetica, sans-serif
  :font-size small
  :line-height 1.3

body
  :padding 10px
  :background #eee url(/images/stripe.png) top left repeat

h1, h2, h3, h4
  :font-weight normal

h1
  :font-size 2em

h2
  :font-size 1.3em
  :border-bottom 2px solid #ccc
  .action
    :font-size 80%

h3
  :font-size 1.1em
  :border-bottom 2px solid #eee

h4
  :border-bottom 1px solid #eee

h2, h3, h4
  :margin 10px 0
  :padding 5px 0
  :position relative

  .current-settings
    :float left

  .total
    :font-size 90%
    :color #999

.action
  :position absolute
  :right 0
  :top 5px
  
#legend
  :background #ffc
  :padding 10px
  h3
    :border none
    :margin 0

strong
  :font-weight bold

p
  :margin 15px 0 5px 0

a
  :text-decoration none
  :color #00c
  &:hover
    :background #00c
    :color #fff

form
  :margin 20px 0

  input, textarea, select
    :display block
    :margin 5px 0 20px 0

  input.text, textarea, select
    :border 1px solid #ccc
    :padding 2px 5px
    :width 300px

  input.axis
    :width 40px

  input.inline
    :display inline

  input.inline
    :display inline

  input.button
    :display inline

  textarea
    :height 100px

  select.axis
    :width auto
    :display inline
    :padding 2px

.errorExplanation
  :background #ee8
  :padding 10px
  :margin 10px 0

  h2
    :margin-top 0
    :border none

  ul
    li
      :padding 5px 0

form.edit_bucket
  :margin 0
  :padding 0

// @layout

#wrapper
  :margin 0 auto
  :background #fff
  :padding 20px
  :-moz-border-radius 5px 0 5px 0

#header
  :padding 10px 0

#title
  :background #996
  :padding 20px
  :margin-bottom 20px
  :-moz-border-radius 5px 0 5px 0
  h1
    :color #fff
    :font-size 2em
    :font-family Georgia, serif
    :font-style italic


#navigation
  :margin 0
  :padding 0 0 5px 0
  :border-bottom 1px dotted #ccc
  :font-size 90%
  :float left
  :width 100%

  ul
    :margin 0

    li
      :float left
      :padding 0
      :margin 0

      a
        :display block
        :padding 0 5px
        &:hover
          :color #00c
          :background transparent

#main-content

#content

  .notice
    :background #ee8
    :padding 10px
    :margin 10px 0

  .help
    :background #ffc
    :padding 10px
    :font-style italic
    :color #666

  .left
    :float left
    :width 65%
    .padding
      :padding-right 10px

  .right
    :float right
    :width 35%
    .padding
      :padding-left 10px

  .even-columns
    .left, .right
      :width 50%

#footer
  :display block

// @lists

ul, ol
  :margin 10px 0 20px 0

  li.even
    :background #fafafa

.override.name
  :font-weight bold
  :color #c00
.override.value
  :color #999

ol
  :list-style-type decimal
  li
    :margin-left 20px

ul#settings, ul#application-settings, ul#global-settings, ul#application-spaces,
ul#axes, ul#contexts, ul#axis-values, ul#application-groups, ul#templates, ul#buckets, ol#axes

  li
    :position relative
    :padding 7px
    :border-bottom 1px solid #eee

    .name

    .sub-text
      :color #999

    .action
      :font-size 100%
      :right 5px
      :top 7px

  ul.overidden-settings
    :margin 5px 0 0 0
    :color #999
    li
      :padding 5px 0
      :border 0
      :margin-left 10px

ul.jq-ui-autocomplete
  :position absolute
  :overflow hidden
  :background #cc9
  :color #fff
  :z-index 100

  li
    :display block
    :overflow hidden
    :padding 10px

  li.active
    :background #dd8

  .name
  .value
    :color #996
    :font-style italic


// @tables

table
  :margin 10px 0
  :width 100%

  th
    :border-bottom 2px solid #eee

  th, td
    :padding 5px

  td
    :border-bottom 1px solid #eee

  td.even
    :background #fafafa

  tr.override
    td
      :background #f9f9ff
      :color #999
      :font-style italic

table#context
  td
    :border-bottom 1px solid #eee
    :padding 5px

table.settings
  .action
    :position relative
  thead
    th
      :width 40%
    th.action
      :width 20%
  td.action
    :text-align right
    img
      :display inline


// @popups

#edit-setting-override-wrapper
  :display none
  :position absolute
  :background #fff
  :z-index 100
  :border 5px solid #ddd
  :padding 20px
